<!DOCTYPE html>
<html>
<head>
<script>
  window.enablePixelTesting = true;
</script>
<script src="../resources/picker-common.js"></script>
<style>
  select:focus {
    outline-width: 0;
  }
  select {
    width: 200px;
    font: 10px Ahem;
    -webkit-appearance: none;
    background-color: white;
  }
  select::-webkit-scrollbar {
    width: 20px;
  }

  select::-webkit-scrollbar-track {
    border-width: 2px;
    border-color: gold;
    border-style: solid;
    box-shadow: 0 0 1px 1px inset blue;
    border-radius: 0px;
    background: orange;
  }

  select::-webkit-scrollbar-track-piece {
     border-width: 2px;
    border-color: fuchsia;
    border-style: solid dashed;
    box-shadow: 0 0 4px 4px inset greenyellow;
    border-radius: 30px;
    background: ivory;
  }

  select::-webkit-scrollbar-corner {
    border-width: 3px;
    border-color: brown;
    border-style: double;
    box-shadow: 0 0 4px 1px inset pink;
    border-radius: 10px 0 20px 0;
    background: yellow;
  }

  select::-webkit-scrollbar-thumb {
    border-width: 3px;
    border-style: solid;
    border-color: transparent;
    border-right-color: black;
    border-top-color: black;
    background-clip: padding-box;
    background-color: gray;
    border-radius: 0 20px 0 10px;
    box-shadow: -1px 0 4px 1px inset white;
  }
</style>
</head>
<body>
<select id='menu'>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
  <option>This is an option</option>
</select>
<script>
   openPickerAppearanceOnly(document.getElementById('menu'), () => testRunner.notifyDone());
</script>
</body>
</html>